<template>
<div class="">
<div class="pr10">
    <div class="analyItem">
        <p class="analyItemTit tx-center">状态</p>
        <div class="analyItemCon">
        </div>
    </div>
</div>
<div class="thinScroll pr10" v-scrollHeight="84">
    <router-link tag="div" exact :to="{path:routerPath('threeBasics'),query:{pressIndex: 0, stageInfo: stageInfo}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center" :class="((this.stageInfo.age === undefined || this.stageInfo.age === null || this.stageInfo.age === '') ||
                (this.stageInfo.is_marry === undefined || this.stageInfo.is_marry === null || this.stageInfo.is_marry === '') ||
                (this.idCardStr === undefined || this.idCardStr === null || this.idCardStr === '') ||
                (photoList[4] === null || photoList[4] ==='' || photoList[4] === undefined) ||
                (photoList[8] === null || photoList[8] ==='' || photoList[8] === undefined) ||
                (this.pemdmert === 0 || this.pemdmert === undefined || this.pemdmert === null || this.pemdmert === '' ||
                this.cityId === 0 || this.cityId === undefined || this.cityId === null || this.cityId === '' ||
                this.quName === 0 || this.quName === undefined || this.quName === null || this.quName === '' ||
                this.AddressDetail === '具体地址信息' || this.AddressDetail === undefined || this.AddressDetail === null || this.AddressDetail === '') ||
                (this.stageInfo.family_name === undefined || this.stageInfo.family_name === null || this.stageInfo.family_name === '') ||
                (this.stageInfo.family_relation === null || this.stageInfo.family_relation ==='' || this.stageInfo.family_relation === undefined) ||
                (this.stageInfo.family_phone === null || this.stageInfo.family_phone ==='' || this.stageInfo.family_phone === undefined) ||
                (this.stageInfo.family_wechat === null || this.stageInfo.family_wechat ==='' || this.stageInfo.family_wechat === undefined) ||
                (this.stageInfo.family_sex === null || this.stageInfo.family_sex ==='' || this.stageInfo.family_sex === undefined)) ? '' : 'analyLightGreen'">个人资料</p >
        <div class="analyItemCon">
            <p class="col-md-12">身份证号：<span class="cLightGray pr8">{{this.idCardStr ? this.idCardStr : ''}}</span></p >
            <!-- <p class="col-md-6">年龄：<span class="cLightGray pr8">{{stageInfo.age ? stageInfo.age : ''}}</span></p >
            <p class="col-md-6">婚否：<span class="cLightGray pr8">{{stageInfo.is_marry ===0 ? '已婚' : '未婚'}}</span></p > -->
            <p class="col-md-6">紧急联系人：<span class="cLightGray pr8">{{stageInfo.family_name ? stageInfo.family_name : ''}}</span></p >
            <p class="col-md-6">手机号：<span class="cLightGray pr8">{{stageInfo.family_phone ? stageInfo.family_phone : ''}}</span></p >
            <p class="fl">
                <span v-if="((this.stageInfo.age === undefined || this.stageInfo.age === null || this.stageInfo.age === '') ||
                (this.stageInfo.is_marry === undefined || this.stageInfo.is_marry === null || this.stageInfo.is_marry === '') ||
                (this.idCardStr === undefined || this.idCardStr === null || this.idCardStr === '') ||
                (photoList[4] === null || photoList[4] ==='' || photoList[4] === undefined) ||
                (photoList[8] === null || photoList[8] ==='' || photoList[8] === undefined) ||
                (this.pemdmert === 0 || this.pemdmert === undefined || this.pemdmert === null || this.pemdmert === '' ||
                this.cityId === 0 || this.cityId === undefined || this.cityId === null || this.cityId === '' ||
                this.quName === 0 || this.quName === undefined || this.quName === null || this.quName === '' ||
                this.AddressDetail === '具体地址信息' || this.AddressDetail === undefined || this.AddressDetail === null || this.AddressDetail === '') ||
                (this.stageInfo.family_name === undefined || this.stageInfo.family_name === null || this.stageInfo.family_name === '') ||
                (this.stageInfo.family_relation === null || this.stageInfo.family_relation ==='' || this.stageInfo.family_relation === undefined) ||
                (this.stageInfo.family_phone === null || this.stageInfo.family_phone ==='' || this.stageInfo.family_phone === undefined) ||
                (this.stageInfo.family_wechat === null || this.stageInfo.family_wechat ==='' || this.stageInfo.family_wechat === undefined) ||
                (this.stageInfo.family_sex === null || this.stageInfo.family_sex ==='' || this.stageInfo.family_sex === undefined))" class="circlemark circlemark-lightRed">待</span>
                <span v-else class="circlemark circlemark-lightGreen">全</span>
            </p>
        </div>
    </router-link>
    <!-- <router-link tag="div" exact :to="{path:routerPath('threeAdress'),query:{pressIndex: 1}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center">住址</p >
        <div class="analyItemCon">
            <p class="col-md-4">现住址：<span class="cLightGray pr8">{{stageInfo.address ? stageInfo.address : ''}}</span></p >
            <p class="fl">
                <span v-if="(stageInfo.address === undefined || stageInfo.address === '' || stageInfo.address === null)" class="circlemark circlemark-lightRed">待</span>
                <span v-else class="circlemark circlemark-lightGreen">全</span>
            </p>
        </div>
    </router-link> -->

    <router-link tag="div" exact :to="{path:routerPath('threeEducation'),query:{pressIndex: 2, stageInfo: stageInfo}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center" :class="(stageInfo.education === undefined || stageInfo.education === '' || stageInfo.education === null) ||
                (stageInfo.certificates === undefined || stageInfo.certificates === '' || stageInfo.certificates === null) ? '' : 'analyLightGreen'">证书</p >
        <div class="analyItemCon">
            <p class="col-md-6">学历：<span class="cLightGray pr8">{{stageInfo.education ? stageInfo.education : ''}}</span></p >
            <p class="col-md-6">证件：<span class="cLightGray pr8">{{stageInfo.certificates ? stageInfo.certificates : ''}}</span></p >
            <p class="fl">
                <span v-if="(stageInfo.education === undefined || stageInfo.education === '' || stageInfo.education === null) ||
                (stageInfo.certificates === undefined || stageInfo.certificates === '' || stageInfo.certificates === null)" class="circlemark circlemark-lightRed">待</span>
                <span v-else class="circlemark circlemark-lightGreen">全</span>
            </p>
        </div>
    </router-link>

    <!-- <router-link tag="div" exact :to="{path:routerPath('threeID'),query:{pressIndex: 3, stageInfo: stageInfo}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center">身份证</p >
               <div class="analyItemCon">
                   <p class="col-md-6">
                        <rx-viewer :images="positiveUrlList" class="fl ml10 ">
                            <div class="clearfix">
                                <div class="imgInfo tx-center">身份证正面</div>
                                <div v-for="(item, index) of positiveUrlList" :key="index" class="fl mr10">
                                    <img :src="item.url | smallImg(80, 80)" :alt="index">
                                </div>
                            </div>
                        </rx-viewer>
                    </p>
                    <p class="col-md-6">
                        <rx-viewer :images="oppositeUrlList" class="fl ml10 ">
                            <div class="clearfix">
                                <div class="imgInfo tx-center">身份证反面</div>
                                <div v-for="(item, index) of oppositeUrlList" :key="index" class="fl mr10">
                                    <img :src="item.url | smallImg(80, 80)" :alt="index">
                                </div>
                            </div>
                        </rx-viewer>
                    </p>
                    <p class="fl">
                        <span v-if="Number(positiveUrlList.length) === 0 || Number(oppositeUrlList.length) === 0" class="circlemark circlemark-lightRed">待</span>
                        <span v-else class="circlemark circlemark-lightGreen">全</span>
                    </p>
        </div>
    </router-link> -->

    <!-- <router-link tag="div" exact :to="{path:routerPath('threeFamily'),query:{pressIndex: 6, stageInfo: stageInfo}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center">家庭关系</p >
        <div class="analyItemCon">
            <p class="col-md-4">姓名：<span class="cLightGray pr8">{{stageInfo.family_name ? stageInfo.family_name : ''}}</span></p >
            <p class="col-md-4">关系：<span class="cLightGray pr8">{{stageInfo.family_relation ? stageInfo.family_relation : ''}}</span></p >
            <p class="col-md-4">电话：<span class="cLightGray pr8">{{stageInfo.family_phone ? stageInfo.family_phone : ''}}</span></p >
            <p class="col-md-4">微信：<span class="cLightGray pr8">{{stageInfo.family_wechat ? stageInfo.family_wechat : ''}}</span></p >
            <p class="col-md-4">性别：<span class="cLightGray pr8">{{stageInfo.family_sex ? (stageInfo.family_sex==0?'女':'男') : ''}}</span></p >
            <p class="fl">
                <span v-if="(stageInfo.family_name === undefined || stageInfo.family_name === '' || stageInfo.family_name === null) ||
                (stageInfo.family_relation === undefined || stageInfo.family_relation === '' || stageInfo.family_relation === null) ||
                (stageInfo.family_phone === undefined || stageInfo.family_phone === '' || stageInfo.family_phone === null) ||
                (stageInfo.family_wechat === undefined || stageInfo.family_wechat === '' || stageInfo.family_wechat === null) ||
                (stageInfo.family_sex === undefined || stageInfo.family_sex === '' || stageInfo.family_sex === null)" class="circlemark circlemark-lightRed">待</span>
                <span v-else class="circlemark circlemark-lightGreen">全</span>
            </p>
         </div>
    </router-link> -->
    <router-link tag="div" exact :to="{path:routerPath('threeStandard'),query:{pressIndex: 7, standards: this.standards}}" class="analyItem anItemBor" active-class="anItemBor-active">
        <p class="analyItemTit tx-center" :class="(Number(this.standards.length) === 0 || this.scores < (30 * this.pmStandardSize)) ? '' : 'analyLightGreen'">解答</p>
        <div class="analyItemCon">
            <p class="col-md-4">总分：<span class="cLightGray pr8">{{ 40 * this.pmStandardSize }}</span></p >
            <p class="col-md-4">得分：<span class="cLightGray pr8">{{ Number(this.standards.length) > 0 ? this.scores : 0 }}</span></p >
            <p class="fl">
                <span v-if="Number(this.standards.length) === 0 || this.scores < (30 * this.pmStandardSize)" class="circlemark circlemark-lightRed">待</span>
                <span v-else class="circlemark circlemark-lightGreen">过</span>
            </p>
        </div>
    </router-link>
    <router-link tag="div" exact :to="{path:routerPath('threeIntroduce'),query:{pressIndex: 4}}" class="analyItem anItemBor" active-class="anItemBor-active">
            <p class="analyItemTit tx-center">介绍</p >
            <div class="analyItemCon">
                <p class="col-md-6">瑞祥介绍</p >
            </div>
    </router-link>
</div>
<!-- {path:routerPath('hander'),query:{pressIndex: 8, stageInfo: stageInfo}} -->
    <div class="analyItem" active-class="anItemBor-active">
        <p class="analyItemTit tx-center">处理</p >
      <div class="analyItemCon tx-center" v-if="Number(this.userInfo.areaId) === 39">
          <el-button @click="submit()" v-if="(this.stageInfo.age === undefined || this.stageInfo.age === null || this.stageInfo.age === '') ||
                (this.stageInfo.is_marry === undefined || this.stageInfo.is_marry === null || this.stageInfo.is_marry === '') ||
                (this.idCardStr === undefined || this.idCardStr === null || this.idCardStr === '') ||
                (photoList[4] === null || photoList[4] ==='' || photoList[4] === undefined) ||
                (photoList[8] === null || photoList[8] ==='' || photoList[8] === undefined) ||
                (this.pemdmert === 0 || this.pemdmert === undefined || this.pemdmert === null || this.pemdmert === '' ||
                this.cityId === 0 || this.cityId === undefined || this.cityId === null || this.cityId === '' ||
                this.quName === 0 || this.quName === undefined || this.quName === null || this.quName === '' ||
                this.AddressDetail === '具体地址信息' || this.AddressDetail === undefined || this.AddressDetail === null || this.AddressDetail === '') ||
                (this.stageInfo.family_name === undefined || this.stageInfo.family_name === null || this.stageInfo.family_name === '') ||
                (this.stageInfo.family_relation === null || this.stageInfo.family_relation ==='' || this.stageInfo.family_relation === undefined) ||
                (this.stageInfo.family_phone === null || this.stageInfo.family_phone ==='' || this.stageInfo.family_phone === undefined) ||
                (this.stageInfo.family_wechat === null || this.stageInfo.family_wechat ==='' || this.stageInfo.family_wechat === undefined) ||
                (this.stageInfo.family_sex === null || this.stageInfo.family_sex ==='' || this.stageInfo.family_sex === undefined) ||

                    (stageInfo.education === undefined || stageInfo.education === '' || stageInfo.education === null) ||
                (stageInfo.certificates === undefined || stageInfo.certificates === '' || stageInfo.certificates === null) ||

                    Number(this.standards.length) === 0 || this.scores < (30 * this.pmStandardSize)" disabled>通过</el-button>
        <el-button @click="submit()" v-else>通过</el-button>
          <!-- <el-button @click="submit()">通过</el-button> -->
      </div>
      <div class="analyItemCon tx-center" v-else>
      </div>
     </div>
</div>
</template>
<script>
import { mapGetters, mapMutations } from 'vuex'
import { findStageInfoById, getPmStandardUserList, getPmStandardList, getUserListinfoPhoto, nextStage, findIDCard, getCityMsgByProvinceId, getAdressByUid, getCountyMsgByCityId } from '../Resources/Api'
export default {
    data () {
        return {
            pmStandardSize: 0, // 该阶段有几个标准
            photoList: [],
            pemdmert: '', // 绑定的现住址的省
            cityId: '', // 绑定的现住址的市
            quName: '', // 绑定的现住址的区
            AddressDetail: '', // 具体地址
            zhuSheng: [], // 现住址的省
            zhuShi: [], // 现住址的市
            zhuQu: [], // 现住址的区
            elstyle: {
                width: '100px',
                height: '100px',
                float: 'left'
            },
            stageInfo: {},
            standards: [], // 用户标准的集合
            scores: 0, // 得分
            oppositeUrlList: [], // 身份证反面
            positiveUrlList: [], // 身份证正面
            idCardStr: '' // 省份证号

        }
    },
    created () {
        this.findStageInfoById()
        this.getPmStandardUserList()
        // this.findPhotoByUid()
        // this.findPhotoByUids()
        this.getAdressByUid()
        this.findIDCard()
        this.getUserListinfoPhoto()
        this.getPmStandardList()
    },
    methods: {
        getAdressByUid () {
            getAdressByUid({
                uid: this.leftInfo.uid
            }).then(res => {
                this.adress = res.data.Body
                if (res.data.Body[0]) {
                    this.pemdmert = res.data.Body[0].province_id
                    this.cityId = res.data.Body[0].city_id
                    this.quName = res.data.Body[0].county_value
                    this.AddressDetail = res.data.Body[0].now_address
                } else {
                    this.pemdmert = 0
                    this.cityId = 0
                    this.quName = 0
                    this.AddressDetail = '具体地址信息'
                }
                this.zhuShiQu()
                this.zhuQuJu()
            }).catch(err => {
                console.log(err)
                // this.$message('失败')
            })
        },
        zhuShiQu (event, flag) {
            if (flag === 1) {
                this.cityId = ''
                this.quName = ''
                this.AddressDetail = ''
            }
            getCityMsgByProvinceId({
                provinceId: this.pemdmert
            }).then(res => {
                this.zhuShi = res.data.Body
                this.zhuQuJu()
            }).catch(err => {
                console.log(err)
                this.$message('提交失败')
            })
        },
        zhuQuJu (event, flag) {
            if (flag === 1) {
                this.quName = ''
                this.AddressDetail = ''
            }
            getCountyMsgByCityId({
                cityId: this.cityId
            }).then(res => {
                this.zhuQu = res.data.Body
            }).catch(err => {
                console.log(err)
                this.$message('提交失败')
            })
        },
        // 查询身份证号
        findIDCard () {
            findIDCard({
                uid: this.leftInfo.uid // 用户id
            }).then(result => {
                if (Number(result.data.StatusCode) === 0) {
                    this.idCardStr = result.data.Body.idcard
                }
            }).catch(err => {
                console.log('查询用户身份证号失败，异常信息：' + err)
            })
        },
        ...mapMutations({
            setUpdateLeft: `SET_UPDATE_LEFT`
        }),
        submit () {
            nextStage({
                userId: this.leftInfo.uid
            }).then(result => {
                if (Number(result.data.StatusCode) === 0) {
                    layer.msg('提交成功')
                    this.leftInfo.stId = 3
                    this.setUpdateLeft()
                }
            }).catch(err => {
                console.log('进入下一阶段失败nextStage,异常信息：' + err)
            })
        },
        // 照片回显
        getUserListinfoPhoto () {
            getUserListinfoPhoto({
                uid: this.leftInfo.uid // this.leftInfo.uid,
            }).then(res => {
                if (res.data.StatusCode === 0) {
                    this.photoList = res.data.Body
                }
                console.log(res.data.Body)
            }).catch(err => {
                console.log('银行卡回显getUserListinfoPhoto失败，失败原因为' + err)
            })
        },

        // 身份证照片正面回显
        // findPhotoByUid () {
        //     findPhotoByUid({
        //         uid: this.leftInfo.uid,
        //         attrModelid: 9 // 正面
        //     }).then(res => {
        //         if (res.data.StatusCode === 0) {
        //             this.positiveUrlList = res.data.Body
        //         }
        //     }).catch(err => {
        //         console.log(err)
        //     })
        // },
        // 身份证照片反面回显
        // findPhotoByUids () {
        //     findPhotoByUid({
        //         uid: this.leftInfo.uid,
        //         attrModelid: 8 // 反面
        //     }).then(res => {
        //         if (res.data.StatusCode === 0) {
        //             this.oppositeUrlList = res.data.Body
        //         }
        //     }).catch(err => {
        //         console.log(err)
        //     })
        // },
        // // 获取所有信息
        findStageInfoById () {
            findStageInfoById({
                uid: this.leftInfo.uid
            }).then(result => {
                this.stageInfo = result.data.Body
            }).catch(err => {
                console.log(err)
            })
        },
        // 查询指定阶段的所有标准
        getPmStandardList () {
            getPmStandardList({
                stId: 2 // 认知阶段
            }).then(result => {
                if (Number(result.data.StatusCode) === 0) {
                    this.pmStandardSize = result.data.Body.pmStandards.length
                }
            }).catch(err => {
                console.log('查询指定阶段的所有标准失败getPmStandardList，异常信息：' + err)
            })
        },
        // 查询用户成绩
        getPmStandardUserList () {
            getPmStandardUserList({
                stId: 2, // 阶段id 1-咨询，2-认知，3-考察，4-签约
                uid: this.leftInfo.uid
            }).then(result => {
                if (Number(result.data.StatusCode) === 0) {
                    this.standards = result.data.Body.pmStandardUsers
                    console.log(this.standards)
                    if (this.standards.length > 0) {
                        // debugger
                        this.standards.forEach(standard => {
                            // debugger
                            const sdScore = Number(standard.sd_score)
                            if (sdScore === 1) {
                                this.scores += 40
                            } else if (sdScore === 2) {
                                this.scores += 30
                            } else if (sdScore === 3) {
                                this.scores += 20
                            } else if (sdScore === 4) {
                                this.scores += 10
                            }
                        })
                    }
                }
            }).catch(err => {
                console.log('查询用户成绩失败getPmStandardUserList，异常信息：' + err)
            })
        },
        // 点击通过
        commit () {
            this.$emit('listenToChildEvent', '考察')
        },
        // 路由跳转路径拼接
        routerPath (path) {
            return this.$route.matched[1].path + '/' + path
        },
        printView () {
            window.open('http://localhost:8888/printpdf/freemarker?pmCode=HFGC20181011082908-60')
        },
        // 直接进行路由跳转路径
        routerPush (path) {
            this.$router.push(this.$route.matched[1].path + '/' + path)
        }
    },
    computed: {
        ...mapGetters(['leftInfo', 'updatePlate', 'userInfo'])
    },
    updated: function () {
    },
    watch: {
        updatePlate () {
            // standards.forEach(standard => {
            //     const sd_score = Number(standard.sd_score)
            //     if (sd_score === 1) {
            //         this.scores += 40
            //     } else if (sd_score === 2) {
            //         this.scores += 30
            //     } else if (sd_score === 3) {
            //         this.scores += 20
            //     } else if (sd_score === 4) {
            //         this.scores += 10
            //     }
            // })
            this.findIDCard()
            this.findStageInfoById()
            this.getAdressByUid()
            this.getUserListinfoPhoto()
            this.scores = 0
            this.getPmStandardUserList()
            // this.findPhotoByUid()
            // this.findPhotoByUids()
        },
        leftInfo () {
            // if (this.leftInfo !== null && this.leftInfo !== undefined && this.leftInfo !== '') {
            this.findStageInfoById()
            // this.GetAppUserInfo()
            // }
        },
        $route () {
            this.findStageInfoById()
        }
    }
}
</script>
